.fixed{
    position: fixed;
    width: 100%;
}
#mask{
    display: none;
    margin-top: 10rem;
    width: 100%;
    position: fixed;
    height: 100%;
    background-color: rgba(0, 0, 0, .3);
    ul{
    display: none;
}
}


header{
    width: 100%;
    height: 4rem;
    background-color: #36d9d6;
    padding:1rem 0;
    text-align:center;
    line-height: 4rem;
    .left{
        float: left;
        margin-left: 1rem;
        img{
            width: 1.5rem;
        }
    }
    .unset{
        margin:0 auto;
        font-size: 2.2rem;
        text-align: center;
        color:white;
    }
    .right{
       position: absolute;
       right: 0;
        font-size: 1.6rem;
        color:white;
        width: 10rem;
    }
}
#task-status{
    width: 100%;
    ul{
        padding:1rem 0;
        font-size: 1.8rem;
        color:#666666;
        background-color: white;
        img{
            vertical-align: bottom;
            margin-left: 1rem;
        }
    }
    li{
        float: left;
        width: 48%;
        text-align: center;
    }
    li:first-of-type{
        border-right: 1px solid #999999;
    }
}
//分类详情
#particulars{
    width: 100%;
    ul{
        width: 100%;
        li{
            width: 100%;
            height: 5rem;
            background-color: white;
            line-height: 5rem;
            font-size: 1.6rem;
            text-align: center;
            color:#666666;
            border-top: 1px solid #cccccc;
        }
        .cover{
            background-color: #36d9d6;
            color:white;
        }
    }
}


// 兼职任务
#work-list{
    padding-top:10rem;
    li{
        height: 7rem;
        margin:0 0 0 1rem;
        display: flex;
        align-items:center;
        border-bottom: 2px solid #f5f5f5;
        .logo{
            width: 4rem;
            height: 4rem;
            border-radius: 50%;
            background-color: #36d992;
            color:white;
            line-height: 4rem;
            text-align: center;
            float: left;
            margin-right: 1rem;
        }
        .bk1{
            background-color:#ff9f40; 
        }
        .bk2{
            background-color:#23c7e8;
        }
        .bk3{
            background-color: #23C7E8;
        }
        .bk4{
            background-color: #FF4040;
        }
        .bk5{
            background-color: #FF408C;
        }
        .center{
            float: left;
            width: calc(100%-50rem);
            p{  
                width: 100%;
                word-break:keep-all; /* 不换行 */
                white-space:nowrap; /* 不换行 */
                overflow:hidden; /* 内容超出宽度时隐藏超出部分的内容 */
                text-overflow:ellipsis; /* 当对象内文本溢出时显示省略标记(...) ；需与overflow:hidden;一起使用。*/
            }
            .color{
                color:#36d9d6;
            }
        }
        .right{
            width: 10rem;
            float: right;
            text-align: center;
            p{
                
                color:#333333;
            }
            span{
                color:#36d9d6;
            }
        }
    }
}
.over{
    font-size: 3rem;
    color:#999999;
    margin-top:10rem;
    text-align: center;
    display: none;
}